{extend name="base"/}
{block name="content"}
<link rel="stylesheet" type="text/css" href="__THEMES__/layui/css/layui.css"/>
<script type="text/javascript" src="__THEMES__/layui/layui.all.js"></script> 
<div class="wrapper">
    <div class="topic">
        <div class="container">
            <div class="row">
                <ol class="breadcrumb hidden-xs">
                    <li><a href="{:url('tcms/index/index')}">首页</a></li>
                    <li class="active">联系我们</li>
                </ol>
            </div>
        </div>
    </div>
    <div class="container">
        <div class="row">
            <div class="col-sm-8">
                <form role="form">
                    {:token_field()}
                    <div class="form-group">
                        <label for="name">姓名</label>
                        <input type="text" class="form-control" id="name" placeholder="请输入你的姓名">
                    </div>
                    <div class="form-group">
                        <label for="email">邮箱</label>
                        <input type="email" class="form-control" id="email" placeholder="请输入你的邮箱">
                    </div>
                    <div class="form-group">
                        <label for="message">留言</label>
                        <textarea class="form-control" rows="3" id="message" placeholder="留言信息"></textarea>
                    </div>
                    <input type="button" class="btn-animate btn-style btn-d btn-primary add-message" value="开始发送" />
                </form>
            </div>
            {php}$config = Core::loadAction('Setting/getSetting');{/php}
            <div class="col-sm-4">
                <h3 class="second-child"><span>联系方式</span></h3>
                <p class="contact-list">
                    {$config.address}<br>
                    网址：{$config.site_host}<br/>
                    手机/微信: {$config.landline}<br>
                    Email: <a href="mailto:{$config.site_admin_email|default='mail@tpframe.com'}">{$config.site_admin_email|default='mail@tpframe.com'}</a>
                </p>
                <div class="maps">
                    <div id="baidu-maps" class="map">地图</div>
                </div>
                <style type="text/css">#baidu-maps {width:313px;height:313px;overflow: hidden;margin:0;font-family:"微软雅黑";}</style>
                <script type="text/javascript">
                    //百度地图API功能
                    function loadJScript() {
                        var script = document.createElement("script");
                        script.type = "text/javascript";
                        script.src = "http://api.map.baidu.com/api?v=2.0&ak=您的密钥&callback=init";
                        document.body.appendChild(script);
                    }
                    function init() {
                        var map = new BMap.Map("baidu-maps");            // 创建Map实例
                        var point = new BMap.Point(106.539, 29.580); // 创建点坐标
                        map.centerAndZoom(point,15);                 
                        map.enableScrollWheelZoom();                 //启用滚轮放大缩小
                    }  
                    window.onload = loadJScript;  //异步加载地图
                    var layer = layui.layer;
                    $(".add-message").click(function(){
                        var name=$.trim($("#name").val()),email=$.trim($("#email").val()),message=$.trim($("#message").val());
                        if(name.length==0){
                          layer.msg("姓名不能为空");return false;  
                        }
                        if(email.length==0){
                          layer.msg("邮箱不能为空");return false;  
                        }
                        if(message.length==0){
                          layer.msg("内容不能为空");return false;  
                        }
                        $.ajaxSetup({
                            headers: {
                                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                            }
                        });
                        $.ajax({
                            type:"post",
                            dataType:"json",
                            url:"{:url('tcms/Message/add')}",
                            data:{"name":name,"email":email,"message":message,"__token__":$("#token").val()},
                            success:function(data){
                                if(data.code!=0){
                                   layer.msg(data.msg);
                                }else{
                                    layer.msg(data.msg,function(){
                                        location.href="{:url('tcms/Index/index')}";
                                    });
                                }
                            }
                        });
                    });
                </script>
            </div>
        </div> 
    </div> 
</div>
{/block}